<!--
 * @Author: your name
 * @Date: 2021-04-11 19:13:47
 * @LastEditTime: 2021-04-11 22:21:10
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \JavaScript\07 - 数组去重.html
-->
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
</head>
<body>
  <script>
    let arr = [12, 20, 13, 13, 12, 5, 20]
    let res = []
    // 第一种: 6ES的Set方法
    // res = [...new Set(arr)]
    // res = Array.from(new Set(arr)) // [12, 20, 13, 5]

    // 第二种：循环比较(拿后一项与当前项比较)
    // for (let i = 0; i < arr.length - 1; i++) {
    //   let cur = arr[i] // 当前项
    //   let args = arr.slice(i +1) // 剩余的项
    //   const index = args.indexOf(cur)
    //   if (index !== -1) { // 说明有重复的
        // 删掉当前项, 结果会改变原本的顺序[13, 12, 5, 20],而且性能差，每次删掉后，后面剩余数据的index都要变化
        // arr.splice(i, 1) // 删掉当前项
        // i-- // 从新的当前项开始继续循环

        // 遇到重复的，拿最后一项来替换，这样就不需要每次都改变index，结果 [5, 20, 12, 13]
        // arr[i] = arr[arr.length - 1]
        // i-- // 从当前项（原本的最后一项）开始继续比较
        // arr.length-- // 去掉最后一项

        // 将重复项设置为null, 结果[null, null, null, 13, 12, 5, 20]，结合filter过滤null, [13, 12, 5, 20]
        // arr[i] = null
    //   }      
    // }
    // 从最后一项开始循环, [12, 20, 13, 5]保证了顺序
    // for (let i = arr.length-1; i >= 0; i--) {
    //   let cur = arr[i]
    //   let args = arr.slice(0, i)
    //   if (args.indexOf(cur) !== -1) { // 重复项
    //     arr.splice(i, 1)
    //   }
    // }

    // 第三种：对象法, 顺序不变[12, 20, 13, 5]
    // let obj = {}
    // for (let i = 0; i < arr.length; i++) {
    //   let cur = arr[i]
    //   if (obj[cur] === undefined) { // 如果为undefined，表示前面没有与该项相同的
    //     obj[cur] = cur
    //   } else { // 如果有相同的，就把当前项删掉
    //     arr.splice(i, 1)
    //     i--
    //   }
    // }
    // res = arr.filter(val => val !== null)

    // 第四种：正则表达式方法
    // 先将数组按圣墟或者降序排列
    arr.sort((a, b) => a - b > 0)
    // 将数组转化为字符串
    arr = arr.join('@') + '@'
    // 定义正则表达式，找到数字后面带有@符号的，1*表示连续匹配0到n次、
    const reg = /(\d+@)\1*/g
    // 定义新数组用来存放结果
    let newArr = []
    arr.replace(reg, (val, group1) => {
      newArr.push(Number(group1.split('@')[0]))
      // newArr.push(Number(group1.slice(0, group1.length - 1))) // 也可以
    })

    res = newArr
    console.log(res);
    

  </script>
</body>
</html>